<template>
    <div>
        <header>
            <div class="sub-title">
                <div class="sub-text">农业数据统计</div>
                <p class="sub-text-en">Agricultural data statistics</p>
            </div>
        </header>
        <ul class="item-box">
            <li v-for="(item,index) in farmingData" :class="item.classname" :key="index">
                <div class="item-title">{{item.title}}<span class="item-line">|</span><span class="item-unit">{{item.unit}}</span></div>
                <div class="item-num">
                    <countTo :startVal='0' :endVal='item.value' :duration=4000></countTo>
                </div>
            </li>
        </ul>
    </div>
</template>
<script>
    export default {
        name:'farming',
        components: {
        },
        props: {
            current:{
                type: String,
                default: ''
            }

        },
        data () {
            return {
                farmingData:[
                    {
                        title:'合作社',
                        unit:'家',
                        value:9800,
                    },
                    {
                        title:'配送商',
                        unit:'家',
                        value:9250,
                    },
                    {
                        title:'种植规模',
                        unit:'亩',
                        value:550,
                    },
                    {
                        title:'养殖规模',
                        unit:'头',
                        value:19897,
//                        classname:''
                    },
                    {
                        title:'涉贫困户',
                        unit:'户',
                        value:835,

                    },
                    {
                        title:'种植户',
                        unit:'户',
                        value:18635,
                    }
                    ],
                currentCounty:''
            }
        },
        computed: {
        },
        watch: {
            current: function (newQuestion, oldQuestion) {
                if(newQuestion===oldQuestion) return false;
                switch (newQuestion){
                    case 'za':
                        console.log('正安县');
                        break;
                    case 'rhs':
                        console.log('仁怀市');
                        break;
                    case 'zunyi':
                        console.log('遵义市');
                        break;
                }
//                this.axios.get(api).then((response) => {
//                    console.log(response.data)
//                })
//                console.log(newQuestion,oldQuestion)
            }
        },
        methods: {
            init(){
//                this.current=this.$store.state.currentCounty;
//               let ID= this.$route.query.id.toString();
//                if(ID !== this.$store.currentCounty){
                    switch (this.current){
                        case 'za':
                            console.log('正安县数据');
                            break;
                        case 'rhs':
                            console.log('仁怀市数据');
                            break;
                        case 'zunyi':
                            console.log('遵义市数据');
                            break;
                    }
//                }


//                if(this.$route.query.id===undefined){
//                    console.log('主页')
//                }else {
//                    console.log('副页')
//                }
                this.farmingData.map(function (currentValue,index,arr) {
                    if(!parseInt((index+1)%3)){
                        currentValue.classname='item'
                    }else {
                        currentValue.classname='item item-border'
                    }
                })
//                console.log(this.farmingData)
            }
        },
        mounted () {
//            this.init()
        },
        created(){
            this.init()
        }
    }

</script>
<style type="text/css">
</style>